<template>
  <div>
    <el-form :model="cusForm" ref="cusForm" label-width="120px" size="small">
      <el-row>
        <el-col :span="6">
          <el-form-item label="姓名" prop="customerName">
            <el-input
              v-model="cusForm.newName"
              disabled
              placeholder=""
            ></el-input>
            <el-tooltip
              placement="bottom"
              :content="cusForm.customerName"
              effect="light"
            >
              <i class="el-icon-view"></i>
            </el-tooltip>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="身份证号码" prop="idNbr">
            <el-input
              v-model="cusForm.newIdNbr"
              disabled
              placeholder=""
            ></el-input>
            <el-tooltip
              placement="bottom"
              :content="cusForm.idNbr"
              effect="light"
            >
              <i class="el-icon-view"></i>
            </el-tooltip>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="身份证地址" prop="idAddress">
            <el-input
              v-model="cusForm.newIdAddress"
              disabled
              placeholder=""
            ></el-input>
            <el-tooltip
              placement="bottom"
              :content="cusForm.idAddress"
              effect="light"
            >
              <i class="el-icon-view"></i>
            </el-tooltip>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="有效期" prop="idEndDate">
            <el-input
              v-model="cusForm.idDate"
              disabled
              placeholder=""
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="手机号码:" prop="customerPhone">
            <el-input
              v-model="cusForm.newPhone"
              disabled
              placeholder=""
            ></el-input>
            <el-tooltip
              placement="bottom"
              :content="cusForm.customerPhone"
              effect="light"
            >
              <i class="el-icon-view"></i>
            </el-tooltip>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="现居住地址:" prop="nowAddr">
            <el-input
              v-model="cusForm.nowAddr"
              disabled
              placeholder=""
            ></el-input>
            <el-tooltip
              placement="bottom"
              :content="cusForm.previewHomeAdd"
              effect="light"
            >
              <i class="el-icon-view"></i>
            </el-tooltip>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="婚姻状况" prop="maritalStatus">
            <el-input
              v-model="cusForm.newMaritalStatus"
              disabled
              placeholder=""
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="住房状况" prop="houseStatus">
            <el-input
              v-model="cusForm.newHouseStatus"
              disabled
              placeholder=""
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="教育程度" prop="education">
            <el-input
              v-model="cusForm.newEducation"
              disabled
              placeholder=""
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <!--单位信息-->
    <config-form :initData="organForm" :span="6" :options="ORGAN_FORM" />
    <!--第一联系人-->
    <config-form :initData="contactForm1" :span="6" :options="CONTACT_FORM" />
    <!--第二联系人-->
    <config-form
      :initData="contactForm2"
      :span="6"
      :options="CONTACT_TOW_FORM"
    />
  </div>
</template>

<script>
import api from "../api";
import { mapState } from "vuex";
import { CONSTANT_OBJ } from "@/utils/constant";
import { CONTACT_FORM, CONTACT_TOW_FORM, ORGAN_FORM } from "../js/contant.js";
import {
  disposePhone,
  encryptIdNo,
  encryptName,
  formatWithMod,
  disposeAddress,
  disposeComName
} from "@/utils/util";
export default {
  props: {
    caseStatus: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      CONTACT_FORM,
      CONTACT_TOW_FORM,
      ORGAN_FORM,
      cusForm: {},
      organForm: {},
      contactForm1: {},
      contactForm2: {}
    };
  },
  mounted() {
    this.getCusInfoData();
    this.getCareerInfoData();
    this.getContactInfoData();
  },
  methods: {
    // 获取客户信息
    getCusInfoData() {
      api.getCustomerData(this.approvalData.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = { ...data } || {};
          let idAdd = `${result.homeAddress.province}-${result.homeAddress.city}-${result.homeAddress.town}-${result.homeAddress.street}`;
          result.idDate = `${result.idBeginDate}至${result.idEndDate}`;
          result.newEducation = this.dicts["education"].childMap[
            result.education
          ];
          result.newHouseStatus = this.dicts["house_status"].childMap[
            result.houseStatus
          ];
          result.newMaritalStatus = this.dicts["marital_status"].childMap[
            result.maritalStatus
          ];
          result.nowAddr = `${result.homeAddress.province}-${
            result.homeAddress.city
          }-${result.homeAddress.town}-${disposeAddress()}`;
          result.previewHomeAdd = idAdd;
          result.newIdAddress = disposeAddress("idcard", result.idAddress);
          result.newPhone = disposePhone(result.customerPhone);
          result.newName = encryptName(result.customerName);
          result.newIdNbr = encryptIdNo(result.idNbr);
          this.cusForm = { ...result };
        }
      });
    },
    // 获取单位信息
    getCareerInfoData() {
      api.getCareerData(this.approvalData.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = { ...data } || {};
          if (data) {
            result.newWorkTime = this.dicts["work_time"].childMap[data.workTime];
            result.organAddr = `${data.organAddress.province}-${data.organAddress.city}-${data.organAddress.town}-${result.organAddress.street}`;
            result.newOrgAdd = `${data.organAddress.province}-${
              data.organAddress.city
            }-${data.organAddress.town}-${disposeAddress()}`;
            result.newCompanyLargeType = result.companyLargeType
              ? `${result.companyLargeType}类企业`
              : "暂未查询到该单位资质";
            result.newSalaryBeforeTax = formatWithMod(result.salaryBeforeTax);
            result.newOrganName = disposeComName(result.organName);
            result.newOrgPhone = disposePhone(result.organPhone);
          }
          this.organForm = result;
        }
      });
    },
    // 获取联系人信息
    getContactInfoData() {
      api.getContactData(this.approvalData.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          let result = [...data] || [];
          result.forEach(item => {
            switch (item.priority) {
              case 1:
                item.newContactRelation = this.dicts[
                  "contact_relation_1"
                ].childMap[item.contactRelation];
                item.newIsKnow = item.isKnow === "Y" ? "是" : "否";
                item.contactName_1 = encryptName(item.contactName);
                item.contactPhone_1 = disposePhone(item.contactPhone);
                this.contactForm1 = { ...item };
                break;
              case 2:
                item.newContactRelation = this.dicts[
                  "contact_relation_2"
                ].childMap[item.contactRelation];
                item.newIsKnow = item.isKnow === "Y" ? "是" : "否";
                item.contactName_2 = encryptName(item.contactName);
                item.contactPhone_2 = disposePhone(item.contactPhone);
                this.contactForm2 = { ...item };
                break;
            }
          });
          console.log(this.contactForm1, "联系人信息1");
        }
      });
    }
  },
  computed: {
    ...mapState({
      approvalData: state => state.approval.approvalData,
      dicts: state => state.common.dicts
    })
  }
};
</script>
